<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<title>评价</title>

	<link rel="shortcut icon" type="image/x-icon" href="../image/logo.png" />
	<link rel="stylesheet"  type="text/css" href="../layui/css/layui.css" />
	<link rel="stylesheet " type="text/css" href="../css/mark.css" />
</head>
<body>
<div class="digital">
	<!-- 头部 -->
	<div class="head">
		<div class="head-x ">
			<div class="head-x-css">
						<span class="layui-breadcrumb" lay-separator="|">
						 <a id="login_state" href="login.html">您好，请登录</a>
						  <a href="register.html">免费注册</a>
						  <a href="#">帮助中心</a>
						  <a href="#">客服</a>
						</span>

			</div>
		</div>
		<!-- 搜索框 -->
		<div class="head-s">
			<ul class="head-s-css">

				<li class="css-logo"><img src="../image/logo.png"/></li>
				<li class="css-text">
					<ul class="text-ul1">
						<li class="text"><input  id="content" type="text" name="title"   placeholder=" 请输入搜索内容"  class="text-input"/> </li>
						<li class="text-s">  <a  id="select"  class="text-btn" href="javascript:void(0)"  ><img src="../image/搜索.png"/></a>  </li>

					</ul>

					<ul class="layui-tab-title">
						<li class="layui-this"><a href="index.html"> 首页</a></li>
						<li><a   href="type.html#手机款式 "> 手机款式</a></li>
						<li><a   href="type.html#电脑整机"> 电脑整机</a></li>
						<li><a   href="type.html#平板类型"> 平板类型</a></li>
						<li><a   href="type.html#影音娱乐"> 影音娱乐</a></li>
						<li><a   href="type.html#摄影摄像"> 摄影摄像</a></li>
					</ul>
				</li>
				<!--头像-->
				<li class="css-touxiang"><a href="#"> <img id="touxiang" src="../image/logo.png"/></a></li>

				<!-- 购物车 -->
				<li class="css-vehicle">
					<div class="vehicle-img"><a href="#"> <img src="../image/购物车.png"/> </a></div>
					<div  class="vehicle-text"> <span><a href="ShoppingCart.html">   我的购物车    </a></span></div>
				</li>


			</ul>

		</div>


	</div>


	<!-- 主体 --><!--样式修改 chen-->
	<div class="main">
		<div class="main-publish">

			<div class="publish-set">
				<textarea id="publish-text" name="" required lay-verify="required" placeholder="请输入" class="layui-textarea"></textarea>
		 
			</div>
			<div class="publish-fa">
				<div  id="test2" class="rating" style="float: left;"></div>
				<div class="fa-button">
					<a  id="publish" href="javascript:void(0)" class="layui-btn">发表</a>
				</div>
			</div>
		</div>

		<fieldset class="layui-elem-field layui-field-title">
			<legend id="pname">猜你喜欢</legend>
		</fieldset>
		
		
		<!-- 评论 -->
		<div class="main-mark" id="yc-movies">
			<div class="mark-user">
				
				<a href="#" class="user-pic" style="float: left;"><img src="../image/login01.png"/></a>
				<div class="user-btm">
					<p class="user-name"> 某某</p>
					<div id="test9"></div>
				</div>
				<p class="user-mark">awdsdaaaaaaaaaaaaaaaaaaaaaaaaas
				sadasdddassssssssssssssssssssssssssssssssssssssssss
				sssssssssssssssssssssssssssssssssssssssssssssssss
				dasdawdsawdasaaaaaaaaaaaaaaaaaaaasdawdsawdsawdsawds</p>
			</div>






		</div>
		 
	</div>


	<!-- 尾部 -->
	<div class="footer" style="height: 100px;color: #FFFFFF;text-align: center;line-height: 100px; ">
		Copyright © 2023 X Licensed
	</div>

</div>
</body>

<script src="../layui/layui.js"></script>
<script type="text/javascript" src="../js/jquery-3.4.1.min.js"></script>
<script src="../js/axios.js"></script>
<script>






	layui.use(['rate'], function(){

		var rate = layui.rate;

		let actualValue;
		//显示文字
		myRate=rate.render({
			elem: '#test2'
			,value: 2 //初始值
			,text: true //开启文本
			,choose: function(value){
				  actualValue = value; // 在回调函数中获取实际值
				console.log(actualValue);
			}

		});

		// 获取数据
		let pId = localStorage.getItem('pId');






		$("#publish").click(function () {

			let  details = $("#publish-text").val();

			$.get("../mark",{op:"insert",pId:pId ,markDetails:details,rating:actualValue},function (rs) {

				if(rs > 0 ){
					alert("发表成功！！");
					window.location.href = 'mark.html';

				}
				else{
					alert("发表失败！！");
				}

			},"json");



		});


		pName();

		function pName() {
			$.get("../mark",{op:"find",pId: pId},function (rs) {
				if(rs.code ==200){
					console.log(rs.data);
					pname(rs.data);

				}
				else{

				}
			},"json");


		}

		function pname(arr) {

			$('#pname').text(arr[0].pName);

		}


		finds();
		function finds() {
			$.get("../mark",{op:"finds",pId: pId},function (rs) {
				if(rs.code ==200){

					console.log(rs.data);

					showMovies(rs.data);
					count = rs.count;



				}
				else{
					layer.msg(rs.msg);
					$("#yc-movies").html('<div class="mark-user">\n' +
							' <div class="zw">暂无评论</div>' +
							'</div>');
				}
			},"json");

		}



		function showMovies(arr) {


			let str = '';
			for(let i=0;i<arr.length;i++){
				str += '<div class="mark-user">'+

					'<a href="#" class="user-pic" style="float: left;"><img src="'+arr[i].pic+'"/></a>'+
					'<div class="user-btm">'+
						'<p class="user-name">'+ arr[i].uNickname+'</p>'+
						'<div id="test9-' + i + '"></div>' + // 使用不同的 ID 来渲染多个评分组件
					'</div>'+
					'<p class="user-mark">'+arr[i].markDetails+'</p>'+
				'</div>';



				// 渲染评分组件
				renderRating('test9-' + i, arr[i].rating); // 调用渲染评分组件的方法





			}

			$("#yc-movies").html(str);


		}

		// 渲染评分组件的方法
		function renderRating(elemId, value) {
			layui.use('rate', function () {
				var rate = layui.rate;
				rate.render({
					elem: '#' + elemId,
					value: value,
					readonly: true
				});
			});
		}






	});







	layui.use('carousel', function() {
			var carousel = layui.carousel
					, laypage = layui.laypage
					, $ = layui.jquery;






			lg();
			//检测是否登录
			function lg() {


				//session里存储   uId
				$.get("../user",{op:"determine" },function (rs) {

					if(rs !=null){

						$("#login_state").text("在线！"); // 修改文本


					}

				},"json");


			}








		$("#select").click(function () {

				let pName = $("#content").val();
				if( pName!=null && ""!=pName){

					//session里存储   pName
					$.get("../prodDetails",{op:"cpName",pName:pName },function (rs) {


						if(rs!=null){
							window.location.href = 'index.html';
						}


					},"json");


				}
				else{

					alert('暂无相关商品！！！');
				}


			});






			//跳转用户个人信息页面
			$("#touxiang").click(function () {

				window.location.href = 'personal.html';

			});


		});




</script>

</html>
